{# 继承母版 #}
{% extends 'base.html' %}
{% block page-title %}
    <title>新闻资讯-网易新闻</title>
{% endblock %}

{% block page-left-content %}
    <div class="container">
        <br>
        <!-- Nav tabs -->
        <ul class="nav nav-tabs" role="tablist">
            <li class="nav-item">
                <a class="nav-link active" data-toggle="tab" href="#home">国际</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" data-toggle="tab" href="#menu1">国内</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" data-toggle="tab" href="#menu2">军事</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" data-toggle="tab" href="#menu3">航空</a>
            </li>
        </ul>

        <!-- Tab panes -->
        <div class="tab-content">
            <div id="home" class="container tab-pane active"><br>
                <h5>国际</h5>
                <!--文章列表开始-->
                {% for gj in article_guoji %}
                <div class="card text-dark" style="margin-top: 10px">
                    <div class="card-body">
                        <h5 class="card-title">
                            <a href="/article_detail-{{ gj.id }}.html" style="text-decoration: none;">{{ gj.title }}</a>
                        </h5>
                        <div class="card-text collapse show" id="demo1">
                            <p>{{ gj.excerpt|truncatechars:70 }}</p>
                            <div class="btn-group float-right float-xl-right float-sm-right float-lg-right float-md-right">
{#                                <button type="button" class="btn btn-sm" disabled>浏览: <span>456</span></button>#}
{#                                <button type="button" class="btn btn-sm"><a href="javascript:;"#}
{#                                                                            style="text-decoration: none;">#}
{#                                    评论:#}
{#                                    <span>23</span> </a></button>#}

                                <button type="button" class="btn btn-sm" disabled>{{ gj.modified_time.date }}</button>
                            </div>
                        </div>
                    </div>
                </div>
                {% endfor %}
                {#    分页#}
{#                <nav aria-label="Page navigation example" style="margin-top: 10px">#}
{#                    <ul class="pagination justify-content-center">#}
{#                        <li class="page-item disabled">#}
{#                            <a class="page-link" href="javascript:;" tabindex="-1">Previous</a>#}
{#                        </li>#}
{#                        <li class="page-item"><a class="page-link" href="javascript:;">1</a></li>#}
{#                        <li class="page-item"><a class="page-link" href="javascript:;">2</a></li>#}
{#                        <li class="page-item"><a class="page-link" href="javascript:;">3</a></li>#}
{#                        <li class="page-item">#}
{#                            <a class="page-link" href="javascript:;">Next</a>#}
{#                        </li>#}
{#                    </ul>#}
{#                </nav>#}
            </div>

            <div id="menu1" class="container tab-pane fade"><br>
                <h5>国内</h5>
                {% for gn in article_guonei %}
                <div class="card text-dark" style="margin-top: 10px">
                    <div class="card-body">
                        <h5 class="card-title">
                            <a href="/article_detail-{{ gn.id }}.html" style="text-decoration: none;">{{ gn.title }}</a>
                        </h5>
                        <div class="card-text collapse show" id="demo1">
                            <p>{{ gn.excerpt|truncatechars:70 }}</p>
                            <div class="btn-group float-right float-xl-right float-sm-right float-lg-right float-md-right">
{#                                <button type="button" class="btn btn-sm" disabled>浏览: <span>456</span></button>#}
{#                                <button type="button" class="btn btn-sm"><a href="javascript:;"#}
{#                                                                            style="text-decoration: none;">#}
{#                                    评论:#}
{#                                    <span>23</span> </a></button>#}

                                <button type="button" class="btn btn-sm" disabled>{{ gn.modified_time.date }}</button>
                            </div>
                        </div>
                    </div>
                </div>
                {% endfor %}
                {#    分页#}
{#                <nav aria-label="Page navigation example" style="margin-top: 10px">#}
{#                    <ul class="pagination justify-content-center">#}
{#                        <li class="page-item disabled">#}
{#                            <a class="page-link" href="javascript:;" tabindex="-1">Previous</a>#}
{#                        </li>#}
{#                        <li class="page-item"><a class="page-link" href="javascript:;">1</a></li>#}
{#                        <li class="page-item"><a class="page-link" href="javascript:;">2</a></li>#}
{#                        <li class="page-item"><a class="page-link" href="javascript:;">3</a></li>#}
{#                        <li class="page-item">#}
{#                            <a class="page-link" href="javascript:;">Next</a>#}
{#                        </li>#}
{#                    </ul>#}
{#                </nav>#}
            </div>
            <div id="menu2" class="container tab-pane fade"><br>
                <h5>军事</h5>
                {% for js in article_junshi %}
                <div class="card text-dark" style="margin-top: 10px">
                    <div class="card-body">
                        <h5 class="card-title">
                            <a href="/article_detail-{{ js.id }}.html" style="text-decoration: none;">{{ js.title }}</a>
                        </h5>
                        <div class="card-text collapse show" id="demo1">
                            <p>{{ js.excerpt|truncatechars:70 }}</p>
                            <div class="btn-group float-right float-xl-right float-sm-right float-lg-right float-md-right">
{#                                <button type="button" class="btn btn-sm" disabled>浏览: <span>456</span></button>#}
{#                                <button type="button" class="btn btn-sm"><a href="javascript:;"#}
{#                                                                            style="text-decoration: none;">#}
{#                                    评论:#}
{#                                    <span>23</span> </a></button>#}

                                <button type="button" class="btn btn-sm" disabled>{{ js.modified_time.date }}</button>
                            </div>
                        </div>
                    </div>
                </div>
                {% endfor %}

                {#    分页#}
{#                <nav aria-label="Page navigation example" style="margin-top: 10px">#}
{#                    <ul class="pagination justify-content-center">#}
{#                        <li class="page-item disabled">#}
{#                            <a class="page-link" href="javascript:;" tabindex="-1">Previous</a>#}
{#                        </li>#}
{#                        <li class="page-item"><a class="page-link" href="javascript:;">1</a></li>#}
{#                        <li class="page-item"><a class="page-link" href="javascript:;">2</a></li>#}
{#                        <li class="page-item"><a class="page-link" href="javascript:;">3</a></li>#}
{#                        <li class="page-item">#}
{#                            <a class="page-link" href="javascript:;">Next</a>#}
{#                        </li>#}
{#                    </ul>#}
{#                </nav>#}
            </div>
            <div id="menu3" class="container tab-pane fade"><br>
                <h5>航空</h5>
                {% for hk in article_hangkong %}
                <div class="card text-dark" style="margin-top: 10px">
                    <div class="card-body">
                        <h5 class="card-title">
                            <a href="/article_detail-{{ hk.id }}.html" style="text-decoration: none;">{{ hk.title }}</a>
                        </h5>
                        <div class="card-text collapse show" id="demo1">
                            <p>{{ hk.excerpt|truncatechars:70 }}</p>
                            <div class="btn-group float-right float-xl-right float-sm-right float-lg-right float-md-right">
{#                                <button type="button" class="btn btn-sm" disabled>浏览: <span>456</span></button>#}
{#                                <button type="button" class="btn btn-sm"><a href="javascript:;"#}
{#                                                                            style="text-decoration: none;">#}
{#                                    评论:#}
{#                                    <span>23</span> </a></button>#}

                                <button type="button" class="btn btn-sm" disabled>{{ hk.modified_time.date }}</button>
                            </div>
                        </div>
                    </div>
                </div>
                {% endfor %}
                {#    分页#}
{#                <nav aria-label="Page navigation example" style="margin-top: 10px">#}
{#                    <ul class="pagination justify-content-center">#}
{#                        <li class="page-item disabled">#}
{#                            <a class="page-link" href="javascript:;" tabindex="-1">Previous</a>#}
{#                        </li>#}
{#                        <li class="page-item"><a class="page-link" href="javascript:;">1</a></li>#}
{#                        <li class="page-item"><a class="page-link" href="javascript:;">2</a></li>#}
{#                        <li class="page-item"><a class="page-link" href="javascript:;">3</a></li>#}
{#                        <li class="page-item">#}
{#                            <a class="page-link" href="javascript:;">Next</a>#}
{#                        </li>#}
{#                    </ul>#}
{#                </nav>#}
            </div>
        </div>
    </div>

{% endblock %}








